<template>
  <div class="chushi">
    <transition>
      <router-view />

    </transition>
    <div class="dibu">
      <router-link to="/chushi/liebiao">首页</router-link>
      <router-link to="/chushi/Hear">爆爆团</router-link>
      <router-link to="/chushi/dingdan">订单</router-link>
      <router-link to="/chushi/my">我的</router-link>
    </div>
  </div>
</template>

<script>
export default {
  name: 'HomeView'
}
</script>
<style scoped>
  .dibu{
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    background-color: white;
    color: black;
    border-top: 1px solid black;
    padding: 20px;
  }
  /* 入场效果 */
.v-enter {
    /* 开始隐藏 */
    opacity: 0;
}

/* 入场动画执行状态 */
.v-enter-active {
    transition: all 1s;
}

/* 动画完成结束时效果 */
.v-enter-to {
    /* 动画完成显示 */
    opacity: 1;
}
</style>
